/**
 * Created by Administrator on 2016/9/12.
 */
var myText = document.getElementById('myText');
var myPwd = document.getElementById('myPwd');
var myPwd1 = document.getElementById('myPwd1');
var myEmail = document.getElementById('myEmail');
var myPhone = document.getElementById('myPhone');
var mySpan = document.getElementsByClassName('span');
var myCheck = document.getElementById('check');
var flag = new Array();
flag[0] = flag[1] = flag[2] = flag[3] = flag[4] = false;
//鼠标选中后，提示文字
function myFocus(){
//    for(var i = 0;i<mySpan.length;i++){
//    alert(this.nextElementSibling.nextElementSibling);
        this.nextElementSibling.nextElementSibling.classList.remove('hide');
//    }

}

function checkBlur0(){
    var values = myText.value;
    var count = 0;
    for(var i = 0;i<values.length;i++){
        if(/[a-zA-Z0-9]/.test(values[i])){
            count += 1;
        }else if(/[\u4E00-\u9FA5]/.test(values[i])){
            count += 2;
        }
    }
    if(count == 0){

        myText.style.borderColor = 'red';
        mySpan[0].innerText = '名称不能为空';
        mySpan[0].style.color = 'red';
    }
    else if(count >= 4 && count <= 16){
        myText.style.borderColor = 'green';
        mySpan[0].innerText = '格式正确';
        mySpan[0].style.color = 'green';
        flag[0] = true;
    }else{
        myText.style.borderColor = 'red';
        myText.setAttribute('borderColor','red');
        mySpan[0].innerText = '字符长度为4~16！';
        mySpan[0].style.color = 'red';
    }
    myText.nextElementSibling.nextElementSibling.classList.remove('hide');
}
//输入密码，进行验证
function checkBlur1(){
    var pwdValues = myPwd.value;
//    alert(pwdValues);
    var letter = 0;
    var number = 0;
    var len = pwdValues.length;
    if(pwdValues == ''){
        myPwd.style.borderColor = 'red';
        mySpan[1].innerText = '请输入密码';
        mySpan[1].style.color = 'red';
    }else if(len>=6 && len<=20){
        for(var j = 0;j<len;j++){
           if(/[0-9]/.test(pwdValues[j])){
               number += 1;
           }else if(/[a-zA-Z]/.test(pwdValues[j])){
               letter += 1;
           }
        }
        if(number == 0 || letter == 0){
            myPwd.style.borderColor = 'red';
            mySpan[1].innerText = '格式错误，请输入6-20位字母和数字组合';
            mySpan[1].style.color = 'red';
        }else{
            myPwd.style.borderColor = 'green';
            mySpan[1].innerText = '密码可用';
            mySpan[1].style.color = 'green';
            flag[1] = true;
        }

    }else{
        myPwd.style.borderColor = 'red';
        mySpan[1].innerText = '格式错误，请输入6-20位字母，数字组合';
        mySpan[1].style.color = 'red';
    }
    myPwd.nextElementSibling.nextElementSibling.classList.remove('hide');
}
//核对密码是否相同
function checkBlur2(){
    var pwdValues = myPwd.value;
    var pwdValues1 = myPwd1.value;
    if(pwdValues==pwdValues1 && pwdValues != ''){
        myPwd1.style.borderColor = 'green';
        mySpan[2].innerText = '密码相同';
        mySpan[2].style.color = 'green';
        flag[2] = true;
    }else if(pwdValues == ''){
        myPwd1.style.borderColor = 'red';
        mySpan[2].innerText = '密码未输入';
        mySpan[2].style.color = 'red';
    }
    else{
        myPwd1.style.borderColor = 'red';
        mySpan[2].innerText = '密码输入不同';
        mySpan[2].style.color = 'red';
    }
    myPwd1.nextElementSibling.nextElementSibling.classList.remove('hide');
}
//验证邮箱格式
function checkBlur3(){
    var emailValue = myEmail.value;
    if(emailValue == ''){
        myEmail.style.borderColor = 'red';
        mySpan[3].innerText = '请输入邮箱';
        mySpan[3].style.color = 'red';

    }else if(/^[0-9a-zA-Z]+@(\w+)\.(\w+)(\.(\w+))?$/.test(emailValue)){
        myEmail.style.borderColor = 'green';
        mySpan[3].innerText = '邮箱格式正确';
        mySpan[3].style.color = 'green';
        flag[3] = true;
    }else{
        myEmail.style.borderColor = 'red';
        mySpan[3].innerText = '格式不正确';
        mySpan[3].style.color = 'red';
    }
    myEmail.nextElementSibling.nextElementSibling.classList.remove('hide');
}

//验证电话号码
function checkBlur4(){
    var phoneValue = myPhone.value;
    if(phoneValue == ''){
        myPhone.style.borderColor = 'red';
        mySpan[4].innerText = '请输入手机号码';
        mySpan[4].style.color = 'red';

    }else{
        if(/^1\d{10}$/.test(phoneValue)){
            myPhone.style.borderColor = 'green';
            mySpan[4].innerText = '手机格式正确';
            mySpan[4].style.color = 'green';
            flag[4] = true;
        }else{
            myPhone.style.borderColor = 'red';
            mySpan[4].innerText = '手机格式不正确';
            mySpan[4].style.color = 'red';
        }
    }
    myPhone.nextElementSibling.nextElementSibling.classList.remove('hide');
}

function finalCheck(){
    var len = flag.length;
    var count = 0;
    for(var i = 0;i<len;i++) {
        if (flag[i] == false) {
            count++;
            switch(i){
                case 0:checkBlur0();
                    break;
                case 1:checkBlur1();
                    break;
                case 2:checkBlur2();
                    break;
                case 3:checkBlur3();
                    break;
                case 4:checkBlur4();
                    break;
                default :alert('error');
            }
        }
    }
    if(count > 0){
        alert('输入有误');
    }else if(count == 0){
        alert('信息填写正确');
    }
}
//绑定函数onfoucs
myText.onfocus = myFocus;
myPwd.onfocus = myFocus;
myPwd1.onfocus = myFocus;
myEmail.onfocus = myFocus;
myPhone.onfocus = myFocus;

//
myText.onblur = checkBlur0;
myPwd.onblur = checkBlur1;
myPwd1.onblur = checkBlur2;
myEmail.onblur = checkBlur3;
myPhone.onblur = checkBlur4;
myCheck.onclick = finalCheck;